<?php

use yii\helpers\Url;
use app\commands\Mytools;


$this->title = '数据统计';
$this->registerJsFile('@web/assets/apache-echarts-5.2.2/dist/echarts.js', ['position' => \yii\web\View::POS_HEAD]);
?>

<style type="text/css">
    #tables {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }

    #tables div.pane {
        background-color: #abcdef;
        border-radius: 5px;
        padding: 13px 3px;
        flex: 1;
        margin: 1em;
        min-width: 400px;
    }

    #tables div.pane .title {
        height: 30px;
        line-height: 20px;
        padding-left: 20px;
        font-weight: 800;
    }

    #tables div.pane .content {
        background-color: #fff;
    }

    #tables div.pane .content table {
        width: 100%;
    }

    #tables div.pane .content td {
        border-bottom: #ddd 1px solid;
        padding: 0.4em;
        text-align: right;
    }

    #tables div.pane .content td.border {
        border-left: #ddd 1px solid;
        text-align: center;
    }
</style>

<div id="balance" style="width:100%;margin:1em 0;">

    <div id="description" style="margin-left:8%;font-weight:800;font-size:16px;">
        <span>本月目标<?= $now_month['plan']; ?>个</span>，
        <span>应到诊<?= $now_month['should_arrive']; ?>个</span>，
        <span>已到诊<?= $now_month['arrive']; ?>个</span>，
        <span>目标完率<?= $now_month['per']; ?>%</span>，
        <span>预计本月到诊<?= $now_month['estimate']; ?>个</span>
    </div>
    <div id="recent_ten_month" style="width:90%;height:300px;"></div>
    <div id="tables" style="border-top:#ccc 3px solid;padding-top:2em;">
        <div class="pane">
            <div class="title">预约到诊统计</div>
            <div class="content">
                <table>
                    <tr>
                        <td width="100" align="right">今日：</td>
                        <td width="50">登记<?= $ten_days[date('Y-m-d')]['create'] ?></td>
                        <td width="50">预约<?= $ten_days[date('Y-m-d')]['order'] ?></td>
                        <td width="50">到诊<?= $ten_days[date('Y-m-d')]['arrive'] ?></td>
                        <td width="50">未到<?= $ten_days[date('Y-m-d')]['should_arrive'] - $ten_days[date('Y-m-d')]['arrive'] ?></td>
                        <td width="60">取消改约<?= $ten_days[date('Y-m-d')]['cancel_modify'] ?></td>
                        <td width="60">明天应到<?= $tomorow_should_arrive ?></td>
                    </tr>
                    <tr>
                        <td align="right">昨日：</td>
                        <td width="50">登记<?= $ten_days[date('Y-m-d', strtotime(' - 1 day'))]['create'] ?></td>
                        <td width="50">预约<?= $ten_days[date('Y-m-d', strtotime(' - 1 day'))]['order'] ?></td>
                        <td width="50">到诊<?= $ten_days[date('Y-m-d', strtotime(' - 1 day'))]['arrive'] ?></td>
                        <td width="50">未到<?= $ten_days[date('Y-m-d', strtotime(' - 1 day'))]['should_arrive'] - $ten_days[date('Y-m-d', strtotime(' - 1 day'))]['arrive'] ?></td>
                        <td></td>
                        <td></td>
                    </tr>
                    <tr>
                        <td align="right">本月：</td>
                        <td width="50">登记<?= $now_month['create'] ?></td>
                        <td width="50">预约<?= $now_month['order'] ?></td>
                        <td width="50">到诊<?= $now_month['arrive'] ?></td>
                        <td width="50">未到<?= $now_month['should_arrive'] - $now_month['arrive'] ?></td>
                        <td></td>
                        <td></td>
                    </tr>
                    <tr>
                        <td align="right">上月同期：</td>
                        <td width="50">登记<?= $last_month['create'] ?></td>
                        <td width="50">预约<?= $last_month['order'] ?></td>
                        <td width="50">到诊<?= $last_month['arrive'] ?></td>
                        <td width="50">未到<?= $last_month['should_arrive'] - $last_month['arrive'] ?></td>
                        <td></td>
                        <td></td>
                    </tr>
                    <tr>
                        <td align="right">上月数据：</td>
                        <td width="50">登记<?= $last_month_all['create'] ?></td>
                        <td width="50">预约<?= $last_month_all['order'] ?></td>
                        <td width="50">到诊<?= $last_month_all['arrive'] ?></td>
                        <td width="50">未到<?= $last_month_all['should_arrive'] - $last_month_all['arrive'] ?></td>
                        <td></td>
                        <td></td>
                    </tr>
                </table>
            </div>
        </div>

        <div class="pane">
            <div class="title">咨询本月统计 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a style="color: blue;" href="<?= Url::toRoute('task/index') ?>">设置任务</a></div>
            <div class="content">
                <table>
                    <tr>
                        <td width="100" class="border">分组</td>
                        <td width="60" class="border">姓名</td>
                        <td width="60" class="border">登记</td>
                        <td width="60" class="border">预约</td>
                        <td width="60" class="border">目标</td>
                        <td width="60" class="border">到诊</td>
                        <td width="60" class="border">环比</td>
                        <td width="60" class="border">完成率</td>
                    </tr>
                    <?php foreach ($waiter_now_month as $group_name => $users) {
                        foreach ($users as $u) { ?>
                            <tr class="border">
                                <td class="border"><?= $group_name ?></td>
                                <td class="border"><?= $u['name'] ?></td>
                                <td class="border"><?= $u['sheet']['create'] ?></td>
                                <td class="border"><?= $u['sheet']['order'] ?></td>
                                <td class="border"><?= $u['sheet']['task'] ?></td>
                                <td class="border"><?= $u['sheet']['arrive'] ?></td>
                                <td class="border"><?= $u['sheet']['previous'] ?></td>
                                <td class="border"><?= $u['sheet']['per'] ?></td>
                            </tr>
                    <?php }
                    } ?>
                </table>
            </div>
        </div>

        <div class="pane">
            <div class="title">咨询上月统计</div>
            <div class="content">
                <table>
                    <tr>
                        <td width="100" class="border">分组</td>
                        <td width="60" class="border">姓名</td>
                        <td width="60" class="border">登记</td>
                        <td width="60" class="border">预约</td>
                        <td width="60" class="border">目标</td>
                        <td width="60" class="border">到诊</td>
                        <td width="60" class="border">环比</td>
                        <td width="60" class="border">完成率</td>
                    </tr>
                    <?php foreach ($waiter_last_month as $group_name => $users) {
                        foreach ($users as $u) { ?>
                            <tr class="border">
                                <td class="border"><?= $group_name ?></td>
                                <td class="border"><?= $u['name'] ?></td>
                                <td class="border"><?= $u['sheet']['create'] ?></td>
                                <td class="border"><?= $u['sheet']['order'] ?></td>
                                <td class="border"><?= $u['sheet']['task'] ?></td>
                                <td class="border"><?= $u['sheet']['arrive'] ?></td>
                                <td class="border"><?= $u['sheet']['previous'] ?></td>
                                <td class="border"><?= $u['sheet']['per'] ?></td>
                            </tr>
                    <?php }
                    } ?>
                </table>
            </div>
        </div>
    </div>

</div>

<script type="text/javascript">
    var chartDom = document.getElementById('recent_ten_month');
    var myChart = echarts.init(chartDom);
    var option;

    option = {
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'shadow'
            }
        },
        legend: {
            data: ['登记', '预约', '到诊']
        },
        toolbox: {
            show: true,
            orient: 'vertical',
            left: 'right',
            top: 'center'
        },
        xAxis: [{
            type: 'category',
            axisTick: {
                show: false
            },
            data: <?= json_encode(array_keys($ten_days)); ?>
        }],
        yAxis: [{
            type: 'value'
        }],
        series: [{
                name: '登记',
                type: 'bar',
                emphasis: {
                    focus: 'series'
                },
                data: <?= json_encode(Mytools::two_array_to_keys($ten_days, 'create')); ?>
            },
            {
                name: '预约',
                type: 'bar',
                emphasis: {
                    focus: 'series'
                },
                data: <?= json_encode(Mytools::two_array_to_keys($ten_days, 'order')); ?>
            },
            {
                name: '到诊',
                type: 'bar',
                emphasis: {
                    focus: 'series'
                },
                data: <?= json_encode(Mytools::two_array_to_keys($ten_days, 'arrive')); ?>
            }
        ]
    };

    option && myChart.setOption(option);
</script>